import React from "react";
// 引入css
import "../css/input.css"
import {PENDDING} from "./config"
class Input extends React.Component{
    // 定义组件的初始化状态
    constructor(props){
        super(props)
    }
    render(){
        return(
        <div>
            <div className="header_title_container">
           <h3>ToDoList</h3> 
            <input className="input_title_container" ref="todoInput"/>
            {/* 点击添加内容添加 */}
           <button  onClick={()=>{
            //  获取输入框的value
            var value=this.refs.todoInput.value;
            // 容错判断
            if(value.length===0){
                alert("添加的内容不能为空")
                return;
            }
            // 组装todo对象
            var todo ={
                // 内容
                content:value,
                // 状态  pendding正在进行
                  status:PENDDING//未经定义的魔法值
            }
            this.props.addTodo(todo)
           }}>添加token</button>
            </div>
        </div>
        )
    }
}
export default  Input;